import React from 'react'
import '../index.less'

export default props => (
  <div className="long-system-container-pad">
    <div className="long-system">
      <h2>教学系统</h2>
      <div className="system-container">
        <div className="system-item">
          <i className="system-icon1"></i>
          <div>
            <p>专属外教+专属中教</p>
            <span>流利口语与知识点兼得</span>
          </div>
        </div>
        <div className="system-item">
          <i className="system-icon2"></i>
          <div>
            <p>适龄教材丰富有趣</p>
            <span>经典教材与经典动画结合</span>
          </div>
        </div>
        <div className="system-item">
          <i className="system-icon3"></i>
          <div>
            <p>课后练习与闯关游戏</p>
            <span>复习学习内容，巩固知识点</span>
          </div>
        </div>
        <div className="system-item">
          <i className="system-icon4"></i>
          <div>
            <p>阶段性总结复习</p>
            <span>温故知新，强化学习效果</span>
          </div>
        </div>
        {/* <div className="system-item">
          <i className="system-icon5"></i>
          <p>英语原声绘本阅读</p>
          <span>听英美原声，跟读经典绘本</span>
        </div> */}
      </div>
    </div>
  </div>
)
